<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="UTF-8" />
    <base th:href="@{/}">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="static/css/minireset.css" />
    <link rel="stylesheet" href="static/css/common.css" />
    <link rel="stylesheet" href="static/css/cart.css" />
    <link rel="stylesheet" href="static/css/bookManger.css" />
  </head>
  <body>
  <div  id="app">
      <div class="header">
          <div class="w">
              <div class="header-left">
                  <a href="index.html">
                      <img src="static/img/logo.gif" alt=""
                      /></a>
                  <h1>图书管理系统</h1>
              </div>
              <div class="header-right">
                  <a th:href="@{/book(method=toBookManager)}" class="order">图书管理</a>
                  <a href="./order_manager.html" class="destory">订单管理</a>
                  <a href="index.html" class="gohome">返回商城</a>
              </div>
          </div>
      </div>
      <div class="list">
          <div class="w">
              <div class="add">
                  <a th:href="@{/book(method=toBookAdd)}">添加图书</a>
              </div>
              <table>
                  <thead>
                  <tr>
                      <th>图片</th>
                      <th>商品名称</th>
                      <th>价格</th>
                      <th>作者</th>
                      <th>销量</th>
                      <th>库存</th>
                      <th>操作</th>
                  </tr>
                  </thead>
                  <tbody>
                  <tr th:each="item : ${pageInfo.data}">
                      <td>
                          <img th:src="${item.imgPath}" alt="" />
                      </td>
                      <td th:text="${item.bookName}">活着</td>
                      <td th:text="${item.price}">
                          100.00
                      </td>
                      <td th:text="${item.author}">余华</td>
                      <td th:text="${item.sales}">200</td>
                      <td th:text="${item.stock}">400</td>
                      <td>
                          <a th:href="@{/book(method=toBookUpdate,bookId=${item.bookId})}">修改</a>
                          <a th:href="@{/book(method=delete,bookId=${item.bookId})}" class="del">删除</a>
                      </td>
                  </tr>
                  </tbody>
              </table>
              <div class="footer">
                  <div class="footer-right">
                      <div th:if="${pageInfo.currentPage != 1}" ><a th:href="@{/book(method=toBookManager,currentPage=1)}">首页</a></div>
                      <div th:if="${pageInfo.currentPage != 1}" ><a th:href="@{/book(method=toBookManager,currentPage=${pageInfo.currentPage - 1})}">上一页</a></div>
                      <ul>
                          <li th:class="${(pageInfo.currentPage==item) ? 'active':''}" class="active" th:each="item : ${#numbers.sequence(1,pageInfo.totalPage)}" th:text="${item}">1</li>
                      </ul>
                      <div th:if="${pageInfo.currentPage != pageInfo.totalPage}" ><a th:href="@{/book(method=toBookManager,currentPage=${pageInfo.currentPage + 1})}">下一页</a></div>
                      <div th:if="${pageInfo.currentPage != pageInfo.totalPage}" ><a th:href="@{/book(method=toBookManager,currentPage=${pageInfo.totalPage})}">末页</a></div>
                      <span>共<span th:text="${pageInfo.totalPage}">10</span>页</span>
                      <span><span th:text="${pageInfo.totalSize}">30</span>条记录</span>
                      <span>到第</span>
                      <input type="text" id="page" v-model="target"/>
                      <span>页</span>
                      <button @click="target1()" >确定</button>
                  </div>
              </div>
          </div>
      </div>
      <div class="bottom">
          <div class="w">
              <div class="top">
                  <ul>
                      <li>
                          <a href="">
                              <img src="static/img/bottom1.png" alt="" />
                              <span>大咖级讲师亲自授课</span>
                          </a>
                      </li>
                      <li>
                          <a href="">
                              <img src="static/img/bottom.png" alt="" />
                              <span>课程为学员成长持续赋能</span>
                          </a>
                      </li>
                      <li>
                          <a href="">
                              <img src="static/img/bottom2.png" alt="" />
                              <span>学员真是情况大公开</span>
                          </a>
                      </li>
                  </ul>
              </div>
              <div class="content">
                  <dl>
                      <dt>关于尚硅谷</dt>
                      <dd>教育理念</dd>
                      <!-- <dd>名师团队</dd>
                      <dd>学员心声</dd> -->
                  </dl>
                  <dl>
                      <dt>资源下载</dt>
                      <dd>视频下载</dd>
                      <!-- <dd>资料下载</dd>
                      <dd>工具下载</dd> -->
                  </dl>
                  <dl>
                      <dt>加入我们</dt>
                      <dd>招聘岗位</dd>
                      <!-- <dd>岗位介绍</dd>
                      <dd>招贤纳师</dd> -->
                  </dl>
                  <dl>
                      <dt>联系我们</dt>
                      <dd>http://www.atguigu.com</dd>
                      <dd></dd>
                  </dl>
              </div>
          </div>
          <div class="down">
              尚硅谷书城.Copyright ©2015
          </div>
      </div>
  </div>

  </body>
  <script src="static/script/vue.js"></script>
  <script>
    var vue = new Vue({
        el:"#app",
        data:{
            target:""
        },
        methods:{
            target1(){
                var num = document.getElementById("page").value;
                //location.href="http://localhost:8080/bookstore/book?method=toBookManager&currentPage="+this.target;
                location.href="book?method=toBookManager&currentPage="+num;
                //return false;
            }
        }
    });

</script>
</html>
